{% extends "backEndBase.html" %}

{% block content %}
<div class="container p-3">
    <h2>考试信息管理</h2>
</div>
<div class="container mt-3 text-center table-responsive">
    <table id="stuTable" class="table table-bordered">
        <thead>
        <tr>
            <th>考试名称</th>
            <th>报名时间</th>
            <th>考试时间</th>
        </tr>
        </thead>
        <tbody>
        <!-- 这里要用jinja2写一个for循环 -->
        {% for exam in exams %}
        <tr>
            <td>{{exam.name}}</td>
            <td>{{exam.sign_time}}</td>
            <td>{{exam.do_time}}</td>
        </tr>
        {% endfor %}
        </tbody>
    </table>
</div>

<div class="container text-center">
    <a href={{url_for("backend.addExam")}} class="btn btn-success add-stu-info">添加</a>
    <a href="backEndModStu.html" class="btn btn-primary" id="mod-stu-info" onclick="modExam(0)">修改</a>
    <a href="#" class="btn btn-danger" id="del-stu-info" onclick="modExam(1)">删除</a>
</div>
<script>
                    var table = document.getElementById("stuTable");
                    // 为表格的每一行添加点击事件
                    for (var i = 0; i < table.rows.length; i++) {
                        if (table.rows[i].parentNode.tagName == "THEAD")
                            continue;
                        table.rows[i].onclick = function () {
                            if (this.classList.contains('table-active')) {
                                this.classList.remove('table-active');
                                return;
                            }
                            var parentNode = this.parentNode;
                            for (var j = 0; j < parentNode.children.length; j++)
                                parentNode.children[j].classList.remove('table-active');
                            this.classList.add('table-active');
                            // this.addClass('table-active').siblings().removeClass('table-active');
                        };
                    }

</script>
<script type="text/javascript" language="javascript">
                    function modExam(op) {
                    }

</script>
{% endblock %}